/**
 * 固定每个item元素的高度，高度来源见[class="child"]中的[height]样式，单位（rpx）[1rpx=0.5px]
 */
const itemHeight = 112;

Component({
  data: {
    childBoxHeight: 0 // 子元素的高度
  },
  properties: {
    defaultOpen: {
      type: Boolean,
      value: false
    },
    name: {
      type: String,
      value: ""
    },
    icon: {
      type: String,
      value: ""
    },
    childArr: {
      type: Array,
      value: [],
      observer(_childArr) {
        // 计算有多少个子元素所占的高度
        this.setData({
          childBoxHeight: this.data.defaultOpen ? itemHeight * _childArr.length : 0
        });
      }
    }
  },
  methods: {
    /**
     * 选择菜单，展示该菜单下的每条子菜单，
     * 并通过子菜单的数量，计算该子菜单列表所需占用的高度
     */
    switchHandle() {
      const { childArr, childBoxHeight } = this.data;
      this.setData({
        childBoxHeight: childBoxHeight > 0 ? 0 :  childArr.length * itemHeight
      });
    },

    /**
     * 子菜单列表触发点击事件，由home组件进行接收
     */
    clickChild(e) {
      this.triggerEvent('click', e.target.dataset);
    }
  }
});